<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图书管理系统</title>
	<script type="text/javascript" src="../../static/easyui/jquery.min.js" charset="utf-8"></script>
	<link id="easyuiTheme" rel="stylesheet" href="../../static/easyui/themes/ui-cupertino/easyui.css">
	<link rel="stylesheet" href="../../static/easyui/themes/icon.css">
	<link rel="stylesheet" href="../../static/font/css/font-awesome.min.css">
	<script type="text/javascript" src="../../static/easyui/jquery.easyui.min.js" charset="utf-8"></script>
	<script type="text/javascript" src="../../static/easyui/locale/easyui-lang-zh_CN.js" charset="utf-8"></script>
	<script type="text/javascript" src="../../static/js/easyui_datagrid_yzy.js" charset="utf-8"></script>
<script type="text/javascript">
	$(function(){
			var h = document.documentElement.clientHeight || document.body.clientHeight;
			$('#t_table').datagrid({
				url:'pagelist',
				idField:'id',
				pagination:true,	//分页
				sortOrder:'desc',
				sortName:'id',
				pageSize:20,
				pageList:[5,10,20],
				height:h-29,
				fitColumns:true,	//宽度是否自适应
				striped:true,	//隔行变色 斑马色
				loadMsg:'数据正在疯狂的加载中...',//加载数据时显示的内容
				rownumbers:true,	//显示序号
				singleSelect:true,	//单选模式
				scrollbarSize:0,	//滚动条宽度
				columns:[ [
					{
						field:'name',
						title:'操作人',
						width:10,
						sortable:true,
						align:"center"
					},{
						field:'content',
						title:'操作',
						width:10,
						sortable:true,
						align:"center"
					},{
						field:'operation',
						title:'操作内容',
						width:20,
						sortable:true,
						align:"center"
					},{
						field:'time',
						title:'操作时间',
						sortable:true,
						width:10,
						align:"center"
						
					},{
						field:'ip',
						title:'IP',
						width:10,
						sortable:true,
						align:"center"
					},{
						field:'book',
						title:'书本信息(书名/ISBN)',
						width:20,
						align:"center",
						sortable:true,
						formatter:function(value,record,index){//鼠标悬停显示数据
							return record.book.name+'/'+record.book.isbn;
						},
						
					},{
						field:'user',
						title:'用户信息(姓名/邮箱)',
						width:20,
						align:"center",
						sortable:true,
						formatter:function(value,record,index){//鼠标悬停显示数据
							return record.user.name+'/'+record.user.username;
						},
					}
				] ],
			});
			//进行查询
			$('#gobtn').click(function(){
				$('#t_table').datagrid('load', serializeForm($('#mysearch').form()));
			});
			$('#removebtn').click(function(){
				//清空form表单
				$('#mysearch').form('clear');
				$("#t_table").datagrid('load', {});
			});
			$("#sx").click(function(){
				self.location.reload();
			});
	});
	//序列化表单
	function serializeForm(form){
		var obj = {};
		$.each(form.serializeArray(), function(index){
			if(obj[this['name']]){
				obj[this['name']] = obj[this['name']] + ',' + this['value'];
			}else{
				obj[this['name']] = this['value'];
			}
		});
		return obj;
	}
</script>
</head>
<body>
<div id="lay" style="width: 100%;height: 100%;">
		<div region='north' class="easyui-layout" style="height: 28px;background: #f4f4f4;">
			<form action="" id="mysearch" method="post">
				<span style="line-height: 27px;color: #666666">
				&emsp;操作人:<input name="name" type="text" value="" class="easyui-textbox" id="yhm">
				&emsp;操作：
				<select class="easyui-combobox" name="content"   style="width:80px;" panelHeight='120px'>   
					<option style="display: none"></option>  
					<option value="申请借书">申请借书</option>   
					<option value="同意借书">同意借书</option>  
					<option value="拒绝借书">拒绝借书</option> 
					<option value="还书声明">还书声明</option> 
					<option value="拒绝借书">确认借书</option> 
				</select>
				&emsp;时间<input name="time" value="" class="easyui-datebox" width="100%" editable="false">
				&emsp;书名:<input name="bookname" value="" class="easyui-textbox" width="100%" >
				&emsp;用户名:<input name="username" value="" class="easyui-textbox" width="100%" >
				</span>
				<a class="easyui-linkbutton" iconCls='icon-zoom' id="gobtn">开始检索</a>
				<a class="easyui-linkbutton" iconCls='icon-undo' id="removebtn">清空条件</a>
				<a class="easyui-linkbutton" data-options="iconCls:'icon-page_white_refresh'" id="sx">刷新子页面</a>
				
			</form>
		</div>
		<div region='center'>
			<table id="t_table"></table>
		</div>
	</div>
</body>
</html>